/**
 * Created by Mark on 2018/4/14.
 * 分页
 */

require("./pagination.css");
var _mm = require("util/mm.js");
var templatePagination = require("./pagination.string");

/*在定义一个函数同时，实际上也就得到了一个同名的类，
而且该函数就是该类的构造器，函数中以this修饰的变量是实例的属性
*/
var Pagination = function(){
    var _this = this;
    this.defaultOption = {//defaultOption为实例的默认属性
        container : null, //分页的容器
        pageNum : 1,      //当前页数
        pageRange : 3,    //页数的浮动
        onSelectPage : null
    };
    //点击页数事件的代理
    $(document).on("click",".pg-item" ,function(){
        var $this = $(this);
        if($this.data("value") !== 1){

        }
        if($this.hasClass("active") || $this.hasClass("disabled")){
            return;
        }
        typeof _this.option.onSelectPage === "function"
         ? _this.option.onSelectPage($this.data("value")) : null;//返回回到函数
    });
};

/*
*当需要给Pagination类的对象添加方法时不适合直接在类里面直接添加方法
*这样会给每一个对象都创建一个函数；而且会使局部变量产生闭包；
*我们可以通过prototype属性添加函数，增加了prototype属性的类继承了原有的类
*/
//渲染分页组件
Pagination.prototype.render = function(userOption){
    this.option = $.extend({},this.defaultOption,userOption);//将defaultOption对象和userOption对象合并
    if(!(this.option.container instanceof jQuery)){//判断容器是否为合法的JQuery对象
        return
    }
    if(this.option.pages <= 1){  //如果总的页数只有一页就不显示分页组件
        return;
    }
    this.option.container.html(this.getPaginationHtml()); //渲染分页内容
};

//获取分页的Html 格式为：|上一页| 2 3 4 =5= 6 |下一页| 5/9
Pagination.prototype.getPaginationHtml = function(){
    var html = "";
    var option = this.option;
    var pageArray = [];
    var start = option.pageNum - option.pageRange > 0 ? option.pageNum - option.pageRange : 1;
    var end = option.pageNum + option.pageRange < option.pages ? option.pageNum + option.pageRange :  option.pages;
    //回到首页的按钮的处理
    pageArray.push({
        name : "回到首页",
        value : 1,
        firstPage : (1 !== option.pageNum )
    });
    //上一页的数据
    pageArray.push({
        name : "上一页",
        value : this.option.prePage,
        disabled : !this.option.hasPreviousPage
    });
    //数字按钮的处理
    for (var i = start ;i <= end ; i++){
        pageArray.push({
            name : i,
            value : i,
            active : (i === option.pageNum )
        });
    }
    //下一页的按钮的处理
    pageArray.push({
        name : "下一页",
        value : this.option.nextPage,
        disabled : !this.option.hasNextPage
    });
    //直接跳到尾页的处理
    pageArray.push({
        name : "跳到尾页",
        value : option.pages,
        lastPage : (option.pages !== option.pageNum )
    });
    html = _mm.renderHtml(templatePagination,{
        pageArray : pageArray,
        pageNum : option.pageNum,
        pages : option.pages
    });
    return html;

}
module.exports = Pagination;